js调用摄像头截图上传见附件
<!DOCTYPE html><html><head><meta charset="utf-8"><title>截图</title></head><body><video autoplay></video><button id="button">截图</button><button id="button2">查看图片URL</button><canvas id="canvas"></canvas><script type="text/javascript">var video = document.querySelector('video');var canvas = window.canvas = document.querySelector('canvas');var button = document.getElementById('button');var button2 = document.getElementById('button2');//点击进行截图，需要传入video元素button.onclick = function() {canvas.width = video.videoWidth;canvas.height = video.videoHeight;canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);};button2.onclick = function() {var strDataURI = canvas.toDataURL("image/jpeg");alert(strDataURI);};//自动打开摄像头var constraints = {audio: true,video: true};function handleSuccess(stream) {window.stream = stream; // make stream available to browser consolevideo.srcObject = stream;}function handleError(error) {console.log('navigator.getUserMedia error: ', error);}navigator.mediaDevices.getUserMedia(constraints).then(handleSuccess).catch(handleError);</script></body></html>
评论